<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('标杆项目查看')" />
    <th:block th:include="include :: bootstrap-editable-css" />
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="btn-group-sm" id="toolbar" role="group">
        <form id="post-form">
            <div class="select-list">
                <ul>
                    <li>
                        项目名称：<input type="text" name="proName"/>
                    </li>
                    <li>
                        <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                    </li>
                </ul>
            </div>
        </form>
    </div>
    <div class="row">
        <div class="col-sm-12 select-table table-striped">
            <table id="bootstrap-table"></table>
        </div>
    </div>
</div>

<th:block th:include="include :: footer" />
<th:block th:include="include :: bootstrap-table-editable-js" />

<script th:inline="javascript">
    var prefix = ctx + "km/prettyPro";
    var datas = [[${@dict.getType('sys_normal_disable')}]];

    $(function() {
        var options = {
            url: prefix + "/list",
            detailUrl: prefix + "/detail/{id}",
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            pageSize:10,
            pageList:[5,10,15,20],
            showPageGo: true,
            onEditableSave: onEditableSave,
            columns: [{
                checkbox: true
            },
                {
                    field : 'proId',
                    title : '项目编号'
                },
                {
                    field : 'proName',
                    title : '项目名称'
                },
                {
                    field : 'startTime',
                    title : '开始时间',

                },
                {
                    field : 'endTime',
                    title : '结束时间',

                },
                {
                    field : 'proType',
                    title : '项目类型',
                    align: 'center',
                    formatter: function(value, row, index) {
                        return value==1?'软装':'硬装';
                    }
                },
                {
                    field : 'proSort',
                    title : '排序',
                    editable : {
                        type : 'text',
                        title : '排序',
                        emptytext : "【排序】为空",
                        validate : function(value) {
                            if (value.length == 0) {
                                return '名称不能为空';
                            }
                        }
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-info btn-xs" href="#" onclick="$.operate.detail(\'' + row.proId + '\')"><i class="fa fa-search"></i>详细</a> ');
                        actions.push('<a class="btn btn-danger btn-xs" href="#"><i class="fa fa-remove"></i>删除</a>');
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
    });

    function onEditableSave (field, row, oldValue, $el) {
        $.ajax({
            type:"post",
            url:prefix+"/edit",
            data: row,
            dataType:"Json",
            success:function (data) {
                if (data.code==0){
                    alert("修改成功");
                }else {
                    alert("修改成功");
                }
            }
        })
    }

    /* 查询表格所有数据值 */
    function getData(){
        var data = $("#" + table.options.id).bootstrapTable('getData');
        alert(JSON.stringify(data))
    }

    /* 查询表格选择行数据值 */
    function getSelections(){
        var data = $("#" + table.options.id).bootstrapTable('getSelections');
        alert(JSON.stringify(data))
    }

    function selectPro(proId) {
        alert("查看标杆项目信息")
    }

</script>
</body>
</html>